/*
CSS书写规范：
1.位置属性(position, top, right, z-index,
display, float等)　　
2.大小(width, height, padding, margin)　　
3.文字系列(font, line-height, letter-spacing,
color- text-align等)　　
4.背景(background, border等)
5.其他(animation, transition等)　　
*/

/*兼容浏览器：不同的浏览器内边距和外边距不同*/
*{
    padding: 0px;
    margin: 0px;
}

a{
    text-decoration: none;
}

/*头部*/
header {
    background-color: #1c232f;
}
header>h2 {
    text-align: center;
    padding: 20px;
    color: white;
}
/*content内容*/
.content{

    width: 100%;
    /* height: 100%; 子内容多少，高度就占多少 */
    height: 90vh;
    background-color: #2a3d6e;
}
.content-left{
    width: 19%;
    height: 100%;
    background-color: #1c232f;
    float: left;
}
.content-right{
    width: 81%;
    height: 100%;
    background-color: #2a3d6e;
    float: right;
}
/*商品管理后台主标题*/
.left-title{
    height: 50px;
    width: 100%;
}
.left-title>a{
    display: block;
    width: 100%;
    height: 50px;
    /*垂直居中*/
    line-height: 50px;
    /*水平居中*/
    /*a标签设置为block后为块状元素并非内联元素所以这句对a标签无效
     故是给a标签间的的文本居中*/
    text-align: center;
    color:white;
    text-decoration: none;

}
/*div分割线*/
.seg{
    height: 1px;
    width: 100%;
    background-color: black;
}
/* 菜单栏导航 */
.nav{
    margin: 5px 0px;
}
/*菜单栏标题*/
.nav-title{
    height: 40px;
    width: 100%;
    text-align: center;
    line-height: 40px;
    color: white;
    /*当鼠标滑过主题时显示手行*/
    cursor: pointer;
}
.nav-title:hover{
    background-color: black;
}
/*子标题内容区*/
.nav-content{
    width: 100%;
    height: 100%;
    background-color: #0c1119;
}
.nav-content>a{
    display: block;
    height: 30px;
    width: 100%;
    color: #cccccc;
    line-height: 30px;
    text-align: center;
    font-size: 14px;
}
.nav-content>a:hover{
    display: block;
    color: #ffffff;
    background-color: #12040c;
}
